<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/register.css">
    <title>register</title>
</head>
<body>
  <!-- 背景图片轮播 -->
  <div id="slideshow">
      <!-- 插入轮播的图片们 -->
      <img class="active" src="./images/register0.jpg" />
      <img src="./images/register1.jpg" />
      <img src="./images/register2.jpg" />
      <img src="./images/register3.jpg" />
      <img src="./images/register4.jpg" />
      <img src="./images/register.jpg" />
  </div>
  <!-- 导航 -->
  <div class="nav1">
    <div class="msk">
        <a href="login.html">登录</a>
    </div>
  </div>
  <div class="nav2">
      <div class="logo">
          <a href="#"><img src="./images/logo.png" alt=""></a>
          <ul>
              <li class="dropdown">
                  <span>首页</span>
                  <div class="dropdown-content">
                      <p><a href="#">主页</a></p>
                      <p><a href="#">搜索</a></p>
                  </div>
              </li>
              <li><a href="#">个人中心</a></li>
              <li><a href="#">关于</a></li>
          </ul>
      </div>
  </div>
  <!-- 主体 -->
  <div class="body">
    <div class="dabiaoke">创建您的账户</div>
    <div class="email">电子邮件地址</div>
    <input type="text" name="" id="">
    <div class="email">确定您的电子邮件地址</div>
    <input type="text" name="" id="">
    <br>
    <div class="agreement"><input class="checkbox" type="checkbox" name="" id="">我同意<a href="./agreement.html" target="_blank">《我志愿成为一名小黑子》</a>的条款。</div>
    <button>继续</button>
  </div>
  <script>
    //---------主角：轮播图函数-------------
    function slideshow() 
    {
      var slideshow=document.getElementById("slideshow"),
      imgs=slideshow.getElementsByTagName("img"), //得到图片们
      current=0; //current为当前活跃的图片编号
      function slideOff() 
      {
        imgs[current].className=""; //图片淡出

      }
      function slideOn() 
      {
        imgs[current].className="active"; //图片淡入

      }
      function changeSlide() 
      { //切换图片的函数
        slideOff();
        current++; //自增1
        if(current>=imgs.length) current=0;
        slideOn();
      }
      //每2s调用changeSlide函数进行图片轮播
      var slideon=setInterval(changeSlide,10000);
    }
    slideshow();
  </script>
</body>
</html>